<ui:composition template="./../WEB-INF/template/template.xhtml" 
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui">

    <ui:define name="content">
       <p:panel id="panel" header="Novo Círculo" style="margin-bottom:10px;">  

           <p:growl id="menssage" showDetail="true"/>
           
            <h:panelGrid columns="3">  

                <h:outputLabel for="nome" value="Nome *" />  
                <p:inputText id="nome"   
                             value="#{circuloBean.circulo.descricao}" required="true" label="Nome">  
                    <f:validateLength minimum="2" />  
                </p:inputText>  
                <p:message for="nome" />  

                <h:outputLabel for="cor" value="Cor *" />  
                <p:colorPicker id="cor" required="true" styleClass="silver" value="#{circuloBean.circulo.corHex}"/>
                <p:message for="cor" display="icon"/> 

            </h:panelGrid>  

        </p:panel>

        <p:commandButton value="Cadastrar" id="botaoCadastrar" update="submenuCirculos" 
                         action="#{circuloBean.processarCadastroAction()}"/> 
    </ui:define>

</ui:composition>
